﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <title>Google YouChoose</title>
	<link href="css/stylePrueba.css" rel="stylesheet" type="text/css" />
	<script src="functions.js">	</script>


     <script src="http://maps.google.com/maps?file=api&amp;v=2.x&amp;key=ABQIAAAAEiriPc8SWTziOL9mrhNPlBQbaHVNyCUFDPC2ksicbGhar7F9XxQCJRlGKdO-gDM8jk5ygqNESP6Hxw"             type="text/javascript">	</script>
    <script type="text/javascript">
	var map;
   	var geocoder;
	var direccion;
	var nzoom; //nivel de zoom
	var miMarca;
	var annio;
	function load(mykml, datos) { // Paso como parámetro el kml y fichero xml de datos
	 if (GBrowserIsCompatible()) {

      map = new GMap2(document.getElementById("map"));	  
		   
	  //map.addControl(new GSmallZoomControl());	// Objeto de Zoom
	 // map.addControl(new GMapTypeControl()); //Objeto de  cambio de tipo (satelite, mapa...)
      	  geocoder = new GClientGeocoder();	
	  nzoom=5; 
	  map.setCenter(new GLatLng(40,-3),nzoom);
	  map.setMapType(G_NORMAL_MAP); // Modo visualización
	
	  var nombre = navigator.appName
	  if (nombre == "Microsoft Internet Explorer"){
		map.disableDragging(); //Deshabilita el drag del mapa solamente en Explorer, porque en el resto no funciona el centrado. 
	  } 
	  
	
	  
	  var kml = new GGeoXml(mykml); 	
	 
	  map.addOverlay(kml);
	  //map.addOverlay(kml,miMarca);
	  if(datos){
	  var div=document.getElementById("tablaDatos");
		leeDatosXML(datos,div);
	  }
	  	
		GEvent.addListener(map, "infowindowclose", function() {  //si cierro una ventana, centro de nuevo el mapa
			map.panTo(new GLatLng(40,-3));		
		});
	
	 
	   
	}else{
		 alert("Lo siento, maps no es compatible con tú navegador");
	
		}	
	
		
  }

	
	
	function leeDatosXML(url,div){		
	
		var xml=GetXmlDocObject();		
	
		xml.async=false;
	
		xml.load(url);		


		var template=xml.getElementsByTagName("file").item(0).getAttribute("template");		
	
		OutputXML_XSL(xml,template,div);		

		
	}
	
	
	
	</script>
  </head>

<body onLoad="javascript:load('http://www.madpixel.es/produccion/google_YouChoose/2004b.kml','datos2004.xml');">

<div  class="contenedor">

	<div class="centro">
	-<div id="map" class="mapa"></div> 
		<div id="index" class="annios">			
			<a href="#" onClick="javascript:load('http://www.madpixel.es/produccion/google_YouChoose/2004b.kml','datos2004.xml');" class="selected">2004</a>
			<a href="#" onClick="javascript:load('http://www.madpixel.es/produccion/google_YouChoose/2000.kml','datos2000.xml');">2000</a>
			<a href="#" onClick="javascript:load('http://www.madpixel.es/produccion/google_YouChoose/1996.kml','datos1996.xml');">1996</a>
			<a href="#" onClick="javascript:load('http://www.madpixel.es/produccion/google_YouChoose/1993.kml','datos1993.xml');">1993</a>
			<a href="#" onClick="javascript:load('http://www.madpixel.es/produccion/google_YouChoose/1989.kml','datos1989.xml');">1989</a>
			<a href="#" onClick="javascript:load('http://www.madpixel.es/produccion/google_YouChoose/1986.kml','datos1986.xml');">1986</a>
			<a href="#" onClick="javascript:load('http://www.madpixel.es/produccion/google_YouChoose/1982.kml','datos1982.xml');">1982</a>
			<a href="#" onClick="javascript:load('http://www.madpixel.es/produccion/google_YouChoose/1979.kml','datos1979.xml');">1979</a>
			<a href="#" onClick="javascript:load('http://www.madpixel.es/produccion/google_YouChoose/1977.kml','datos1977.xml');">1977</a>
		</div> 
		
		<div id="tablaDatos">	</div>
	</div>
	<div class="izq"></div>
	<div class="dch"></div> 


</div>



</body>
</html>
